<template>
 <div style="padding: 1rem">
   <!-- 管理表格 -->   
   <el-table
     :data="list"
     border="border"
     style="width: 100%; margin-top: 1rem"
   >
     <el-table-column prop="dayOfWeek" label="星期"></el-table-column>
     <el-table-column prop="points" label="积分"></el-table-column>
    
     <el-table-column label="操作">
       <template slot-scope="scope">
         <!-- 编辑按钮 -->
         <el-button type="text" @click="showEditDialog(scope.row)"
           >编辑</el-button
         >
       </template>
     </el-table-column>
   </el-table>
   <el-pagination
     @size-change="handleSizeChange"
     @current-change="handleCurrentChange"
     :current-page="currentPage"
     :page-sizes="[10, 20, 30, 40]"
     :page-size="pageSize"
     layout="total, sizes, prev, pager, next, jumper"
     :total="totalWines"
   />
   <!-- 添加/编辑对话框 -->
   <el-dialog
     :visible.sync="dialogVisible"
     title="编辑"
     @close="handleCloseDialog"
   >
     <el-form
       ref="userForm"
       :model="currentUser"
       title="编辑"
       label-width="80px"
     >
       <el-form-item label="星期" prop="dayOfWeek">
         <el-input :disabled="true" v-model="currentUser.dayOfWeek"></el-input>
       </el-form-item>
       <el-form-item label="积分" prop="points">
         <el-input v-model="currentUser.points"></el-input>
       </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button @click="handleCloseDialog">取消</el-button>
       <el-button type="primary" @click="handleSave">保存</el-button>
     </div>
   </el-dialog>
 </div>
</template>

<script>
import { list,update} from "@/api/dailypoints";
import { Message } from "element-ui";
export default {
 data() {
   return {
     list: [], // 用户数据
     dialogVisible: false,
     mode: "add",
     currentPage: 1,
     pageSize: 10,
     totalWines: 9,
     searchKeyword: "",
     currentUser:{
      dayOfWeek:null,
      points:null
     }
   };
 },
 methods: {
   handleChange(value) {
     console.log(value);
   },
   handleCurrentChange(val) {
     this.currentPage = val;
     this.loadUsers();
   },
   handleSizeChange(val) {
     console.log(val);
     this.pageSize = val;
     this.loadUsers();
   },
   // 显示添加对话框
   showAddDialog() {
     this.dialogVisible = true;
     this.mode = "add";
     this.currentUser = {
       uId: null,
       username: "",
       phoneNumber: "",
       email: "",
     };
   },
   // 显示编辑对话框
   showEditDialog(row) {
     this.dialogVisible = true;
     console.log(row);
     this.currentUser = { ...row };
     this.mode = "edit";
   },

   // 关闭对话框
   handleCloseDialog() {
     this.dialogVisible = false;
   },
   async editUser() {
  
     const param = {
      dayOfWeek:this.currentUser.dayOfWeek,
      points:this.currentUser.points
     };
     
     try {
       const res = await update(param);
       if (res.code === 200) {
         // 添加用户成功，显示成功提示
         Message.success("修改成功");
         this.loadUsers();
         // 其他操作...
       } else {
         // 添加用户失败，显示失败提示
         Message.error(res.message || "修改失败");
         // 其他操作...
       }
     } catch (error) {
       // 异常处理
       console.error("修改失败", error);
       Message.error("修改失败，请稍后重试");
     }
   },
   // 保存用户信息
   handleSave() {
     // 调用后端接口保存数据，示例中未实现
     // 保存成功后，刷新用户数据
     // if (this.mode === "add") {
     //   // 执行添加用户的操作
     //   this.addUser();
     // } else if (this.mode === "edit") {
       // 执行编辑用户的操作
       this.editUser();
     // }
   },
 
   // 加载用户数据，示例中未实现
   async loadUsers() {
     // 调用后端接口获取用户数据，示例中未实现
     // 将获取到的数据赋值给 this.users
     const res = await list(
       this.currentPage,
       this.pageSize
     );
     if (res.code == 200) {
       this.list = res.data.list.records;
       this.pageSize = res.data.list.size;
       this.currentPage = res.data.list.current;
       this.totalWines = res.data.list.total;
     }
   },
   
  },
 computed: {
   // dialogTitle() {
   //   return this.mode === "add" ? "添加用户" : "编辑用户";
   // },
 },
 mounted() {},
 created() {
   // 初始化加载用户数据
   this.loadUsers();
 },
};
</script>

<style scoped>
/* 添加适当的样式以美化页面 */
</style>
